<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
<input type = "text">
<button>发送</button>
<script>
    /*
    * 正则表达式：
    *   正确的规则的表达式 大小写严格区分
    *   手机号 邮箱 身份证等
    *
    *   正则表达式特点：写的很少 描述非常强大 但是非常难读懂
    *
    *   正则的数据类型是什么？ 是对象 万物皆对象
    *
    *   对象的生成方法：new方法
    *
    *   1.正则表达式的第一种写法：new RegExp
    *
    *   正则表达式的方法
    *   方法一 .test方法 测试 字符串中是否有条件的字符
    *       写出正则表达式的时候，描述的是一段字符串，不是包含关系那么简单，比如字符串"abc"中，你可以测试出"ab""bc"，但是不能测试出"ac"，不能断开
    *   .test方法的返回值：true / false
    * */

    let reg = new RegExp("a") //匹配字符串中是否有字母a

    let str = "abc"

    console.log(reg.test(str)) //返回true 表示这个字符串中含义字母a

    /*
    * 2.正则表达式的第二种写法：//
    *
    * */

    let reg1 = /bc/

    let str1 = "abc"

    console.log(reg1.test(str1))

    /*
    * 深入知识：
    *   1.匹配位置：字符串的开头和结尾
    *       ^ 匹配开头
    *       ^a 表示 a必须要在字符串的最开始位置
    *
    *       $ 匹配结束
    *       a$ 表示 a必须要在字符串的结束位置
    *
    *       /^a$/ 表示 这一个a必须即是开头又是结尾(只有一个a)
    *
    * */

    let reg2 = /^银时说/ //匹配银时说是否在字符串开头位置
    let str2 = "银时说：阿飞很帅"
    let reg22 = /很帅$/ //匹配很帅是否在字符串结束位置

    console.log(reg2.test(str2))
    console.log(reg22.test(str2))

    //要匹配一个开头和结尾都是a的字符串
    let str222 = "aba"
    let reg222 = /^a$/ //同一个a既要是开始又要是结束
    let reg2222 = /^aa$/ //以一个a开头，紧挨着以一个a结尾，中间没有任何东西
    let str2222 = "aa"

    console.log(reg222.test(str222)) //false
    console.log(reg2222.test(str222)) //false
    console.log(reg2222.test(str2222)) //true

    /*
    * 选择：
    *   box fox
    *   正则表达式二选一的情况 b 或者是 f
    *   [] 单个字符的选择 即选择中括号[]中的一个内容进行匹配 [abc]选择a或者选择b或者选择c进行匹配
    *   [] 字符串中是否包含某某到某某的简单写法 [0-9] [a-z]
    *
    *   [^abc] 只要匹配到a b c 之外的任意一个字符 就匹配成功了
    * */

    let str3 = "sjjvwencboxeifoxdkfu2n"

    let reg3 = /[bf]ox/ //检测字符串中是否含有box或者fox

    console.log(reg3.test(str3)) //true


    //判断一个字符串中是否有数字？
    let str4 = "anchid8hcb9dhq"

    let reg4 = /[0-9]/ //判断字符串中是否有数字

    console.log(reg4.test(str4))


    //判断一个字符串中是否有字母
    let str5 = "ahdb8796cndhDzxs"
    let reg5 = /[a-zA-Z]/ //要么是a-z，要么是A-Z，就是是否包含字母的意思
    let reg55 = /a-zA-Z0-9/ //要么包含a-z，要么包含A-Z，要么包含0-9

    console.log(reg5.test(str5))


    //正则表达式的特殊符号
    /*
    * 匹配数字：
    *   \d 就是[0-9]的简写
    *
    * 匹配特殊符号：
    *   \s 匹配所有空格缩进换行换页等等
    *
    * 匹配单个任意普通字符：
    *   \w 匹配单个任意普通字符
    *
    * 在字符串或者正则表达式中 都有特殊的符号：
    *   \ 反斜杠：转义符，只会将后面紧挨着的一个字符转成另外一个含义，如果本身有特殊含义就会被转成无特殊含义，如果本身无特殊含义就会被转成有特殊含义，转不了就直接消失
    *   "a\nc" -> a换行c   "a\aa" -> \a没有特殊含义，所以直接消失就是 "aaa"  "\\" -> 第一个转义符将第二个转义符转义了 -> \
    *   如果输出两个斜杠// 最好对其进行转义 "\/\/" 这样就绝对不会被理解成注释
    *
    *   / 斜杠
    *
    * */
    /*
    let reg6 = /[^abc]/ //匹配一个字符，除了a b c之外的任意一个字符，就是只要字符串中含有除了a b c之外的其他任意一个字符，就匹配成功了

    let input = document.querySelector("input")
    let button = document.querySelector("button")

    button.onclick = function(){
        let val = input.value
        if(!reg6.test(val)){ //没有包含除了abc之外的任意一个字符，全是abc
            console.log("你输入的内容含有非法字符")
        }
        if(reg6.test(val)){ //有包含除了abc之外的任意一个字符
            console.log("你输入的内容含有关键词")
        }
    }*/

    /*
    //那如果要做一个关键词筛选，如果包含黄赌毒，就匹配失败，该怎么写呢，要用到取反
    let reg6 = /[黄赌毒]/ //匹配一个字符，包含黄赌毒中任意一个字符，就是只要字符串中含有 黄赌毒 任意一个字符，就匹配成功了

    let input = document.querySelector("input")
    let button = document.querySelector("button")

    button.onclick = function(){
        let val = input.value
        if(!reg6.test(val)){ //原本是包含 黄赌毒 任意一个就匹配成功，现在取反，就是不包含 黄赌毒 中任意一个就匹配成功
            console.log("你输入的内容是合法字符")
        }
        if(reg6.test(val)){ //包含 黄赌毒 中任意一个 匹配失败
            console.log("匹配失败，你输入的内容含有非法字符")
        }
    }*/

    //要搞明白，正则表达式中用于匹配的内容，具体是需要保留的，还是要被剔除的，是可以自己进行设置的(剔除就取反)
    let reg6 = /[^a-z]/ //匹配一个字符，除了a-z之外的任意一个字符，就是只要字符串中含有除了a-z之外的其他任意一个字符，就匹配成功了
    let reg7 = /^[a-z]/ //匹配一个开头字符，是a-z之中任意一个，就匹配成功，就是a-z任意一个字符串出现在最开始位置
    let reg8 = /^[^a-z]/ //匹配开头位置，任意非a-z之中的字符


    let input = document.querySelector("input")
    let button = document.querySelector("button")

    button.onclick = function(){
        let val = input.value
        if(!reg8.test(val)){
            console.log("你输入的内容含有非法字符")
        }
        if(reg8.test(val)){
            console.log("你输入的内容含有关键词")
        }
    }

</script>
</body>
</html>